import { DateTimePicker, type DateTimePickerProps } from '@mui/x-date-pickers'
import { type Control, Controller } from 'react-hook-form'

export const DateTimeControlled = (
	props: DateTimePickerProps<any> & {
		control: Control<any>
		name: string
		label: string
		readOnly?: boolean
	}
) => {
	const { control, name, label, readOnly = false, ...rest } = props

	return (
		<Controller
			name={name}
			control={control}
			render={({ field }) => (
				<DateTimePicker
					{...field}
					{...rest}
					label={label}
					readOnly={readOnly}
					ampm={false}
				/>
			)}
		/>
	)
}
